<template>
	<view class="personal-page">
		<view class="personal-header">
			<view class="grade-school">
				<view class="portrait">
					<image src="../../static/image.png" mode=""></image>
				</view>
				<view class="message">
					<text>班级:一(1)</text>
					<text>学校:育儿小学</text>
				</view> 
				<view class="setting">
					<image src="../../static/set.png" @click="skip_next('set')" mode=""></image>
				</view>
			</view>
			<view class="encoding-student">
				<view class="Invitation-code">
					<text>A100091</text>
				</view>
				<view class="student-count">
					<text @click="skip_next('maintain')">学生:43</text>
				</view>
				<view class="leave-approval">
					<text>3</text>
					<text>待批请假</text>
				</view>
			</view>
		</view>
		<view class="personal-part">
			<CommonList :listData="listData" @skip_next="skip_next"/>
		</view>
	</view>
</template>

<script>
	import  {getHomeList}  from '@/api/index.js';
	import CommonList from './components/commonList.vue';
	export default {
		data() {
			return {
				listData:[
					{
						"icon":"/static/operation.png",
						"name":"班级作业",
						"count":"266",
						"rightIcon":"/static/rightIcon.png"
					},
					{
						"icon":"/static/activity.png",
						"name":"活动接龙",
						"count":"266",
						"rightIcon":"/static/rightIcon.png"
					},
					{
						"icon":"/static/punch.png",
						"name":"打卡记录",
						"count":"43",
						"rightIcon":"/static/rightIcon.png",
						"skip":"calendar"
					},
					{
						"icon":"/static/teacher.png",
						"name":"教师管理",
						"rightIcon":"/static/rightIcon.png",
						"skip":"teacher"
					},
					{
						"icon":"/static/grade.png",
						"name":"成绩记录",
						"rightIcon":"/static/rightIcon.png",
						"skip":"record"
					}
				]
			}
		},
		onLoad() {
				
		},
		methods: {
	      skip_next(name){
			  console.log(name)
			  // this.$Router.push(path)
			  this.$Router.push({
				  name:name,
				  params:{}
			  })
// 			uni.navigateTo({
// 				url: path
// 			});
		  }
		},
		components:{
			CommonList
		}
	}
</script>

<style lang="scss" scoped>
	page,.personal-page{
		width: 100%;
		height: 100%;
		position: relative;
		.personal-header{
		   position: fixed;
		   top: 0;
		   width: 100%;
		   height: 300upx;
		   background: #f8f8f8;
		   display: flex;
		   flex-direction: column;
		   padding:30upx;
		   box-sizing: border-box;
		   .grade-school{
			   flex:6;
			   display: flex;
			   .portrait{
				   width: auto;
				   display: flex;
				   align-items: center;
				   &>image{
					   width: 120upx;
					   height: 120upx;
				   }
			   }
			   .message{
				   flex: 1;
				   display: flex;
				   flex-direction: column;
				   &>text{
					   flex: 1;
					   display: flex;
					   align-items: center;
					   padding-left: 30upx;
					   box-sizing: border-box;
					   font-size: 32upx;
				   }
			   }
			   .setting{
				   width: auto;
				   display: flex;
				   align-items: center;
				   &>image{
					   width: 60upx;
					   height: 60upx;
				   }
			   }
		   }
		   .encoding-student{
			   flex: 4;
			   display: flex;
			   font-size: 32upx;
			   .Invitation-code,
			   .student-count{
				   flex: 1;
				   display: flex;
				   align-items: flex-end;
				   justify-content: center;
			   }
			   .leave-approval{
				   flex: 1;
				   display: flex;
				   flex-direction: column;
				   &>text{
					   flex: 1;
					   display: flex;
					   align-items: flex-end;
				       justify-content: center;
				   }
			   }
		   }
		}
		.personal-part{
			position: absolute;
			top: 300upx;
			width: 100%;
			bottom: 0px;
			overflow-y: auto;
			&::-webkit-full-screen{
				width: 0;
			}
		}
	}
</style>
